<template>
  <div id="client">
    <p style="margin-left: 80px; margin-bottom: 20px">
      流程名称：<el-input
        style="width: 180px; margin-left: 10px; margin-right: 20px"
        placeholder="流程名称"
        v-model="input"
        clearable
      ></el-input>
      &nbsp;&nbsp;&nbsp; 参数键名：<el-input
        style="width: 180px; margin-left: 10px; margin-right: 20px"
        placeholder="参数键名"
        v-model="input"
        clearable
      ></el-input>
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      <el-button type="primary">查询</el-button>
      <el-button>重置</el-button>
    </p>
    <el-table
      :data="tableData"
      border
      style="width: 100%; margin-left: 80px"
      height="500"
    >
      <el-table-column prop="id" label="ID" width="150px"> </el-table-column>
      <el-table-column prop="name" label="流程名称" width="150px">
      </el-table-column>
      <el-table-column prop="code" label="流程编号" width="150px">
      </el-table-column>
      <el-table-column prop="typecode" label="流程版本号" width="150px">
      </el-table-column>
      <el-table-column prop="laycode" label="部署编号" width="150px">
      </el-table-column>
      <el-table-column prop="filename" label="资源文件名称" width="150px">
      </el-table-column>
      <el-table-column prop="yesorno" label="是否挂起" width="150px">
      </el-table-column>
    </el-table>
    <div class="block">
      <p style="text-align: center; margin-top: 10px">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="currentPage1"
          :page-sizes="[100, 200, 300, 400]"
          :page-size="100"
          layout="total, sizes, prev, pager, next, jumper"
          :total="400"
        >
        </el-pagination>
      </p>
    </div>
  </div>
</template>

<script>
export default {
  name: "SalesOrderTracking",
  data() {
    return {
      currentPage1: 5,
      tableData: [
        {
          id: "1",
          code: "132",
          typecode: "123",
          laycode: "321",
          filename: "789",
          yesorno: "是",
        },
      ],
      dialogFormVisible: false,
      value2: "",
    };
  },
  methods: {
    goto(to) {
      if (this.$route.path !== "/" + to) {
        this.$router.push(to);
      }
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
    },
  },
};
</script>

<style scoped>
.el-button el-button--default el-popover__reference {
  margin-right: 20px;
}

tr {
  border: 1px solid black;
}
</style>